---
title: 医疗安全不良事件
---
<template>
  <my-wrapper :header="null">
  <div>
    <el-button plain type="primary" @click="rowNew">新增</el-button>
    <el-button plain type="success" >导出</el-button>
<!--    <el-button plain type="success" >审核</el-button>-->
<!--    <el-button plain type="danger" >审核不通过</el-button>-->
<!--    <el-button plain type="warning" >取消审核</el-button>-->
<!--    <el-button plain type="primary" >转发</el-button>-->
<!--    <el-button plain type="success" >处理</el-button>-->
    <!--表格内容-->
    <el-table
      ref="list"
      :data="tableData"
      style="width: 100%;margin-top: 1vw"
      border
      stripe
      highlight-current-row
      :default-sort="{prop: 'date', order: 'descending'}"
      @row-click="handleRowClick"
      @select-all="handleCheckedAllAndCheckedNone"
      @select="handleCheckedAllAndCheckedNone">

      <el-table-column property="patientName" label="患者姓名" width="100" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="sex" label="性别" width="50"></el-table-column>
      <el-table-column property="adverseDate" label="报告日期" width="120" sortable :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <i class="el-icon-time"></i>
          <span style="margin-left: 5px">{{scope.row.adverseDate}}</span>
        </template>
      </el-table-column>
      <el-table-column property="eventDate" label="发生日期" width="120" sortable :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <i class="el-icon-time"></i>
          <span style="margin-left: 5px">{{scope.row.eventDate}}</span>
        </template>
      </el-table-column>
      <el-table-column property="updateTime" label="提交时间" width="120" sortable :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <i class="el-icon-time"></i>
          <span style="margin-left: 5px">{{scope.row.updateTime}}</span>
        </template>
      </el-table-column>
      <el-table-column property="reporterName" label="提交人姓名" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="clinicalDiagnosis" label="临床诊断" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="place" label="事件发生场所" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="results" label="不良事件后果" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="event" label="事件主要表现" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="eventCategory" label="不良事件类别" width="120" :show-overflow-tooltip="true"></el-table-column>
<!--      <el-table-column property="col10" label="感染例数" width="120" :show-overflow-tooltip="true"></el-table-column>-->
<!--      <el-table-column property="col11" label="发生感染疾病名称" width="120" :show-overflow-tooltip="true"></el-table-column>-->
      <el-table-column property="reporterType" label="报告人" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="partiesType" label="当事人类型" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="phone" label="联系电话" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="departName" label="科室" width="120" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column property="status" label="提交状态" width="120" :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <span v-if="scope.row.status=='1'" style="margin-left: 5px;color: #007df8">已保存</span>
          <span v-if="scope.row.status=='2'" style="margin-left: 5px;color: #13ce66">已审核</span>
          <span v-if="scope.row.status=='-99'" style="margin-left: 5px;color: red">审核不通过</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="180" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button plain circle icon="el-icon-edit-outline" type="primary" title="编辑" size="small"
            @click="rowEdit(scope.$index, scope.row)"></el-button>
          <el-button plain circle icon="el-icon-check" type="success" title="审核通过" size="small"
                     @click="rowDel(scope.$index, scope.row, $event);"></el-button>
          <el-button plain circle icon="el-icon-close" type="danger" title="审核不通过" size="small"
                     @click="rowDel1(scope.$index, scope.row, $event);"></el-button>
          <el-button plain circle icon="el-icon-delete" type="danger" title="删除" size="small"
                     @click="rowDel12(scope.$index, scope.row, $event);"></el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <el-pagination
      :page-sizes="[10, 20, 30, 40]"
      :page-size="10"
      :total="tableData.length"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>
    <!--编辑-弹出层-->
    <my-dialog
      title="新增"
      :visible.sync="isShowEditDialog"
      draggable
      target="body"
      width="1100px"
      height="700px"
      @submit="handleSubmit"
      @close="dialogClose">
      <el-form
        ref="editForm"
        :model="formFileds"
        label-width="55px"
        :rules="rules">
        <el-row>
            <el-col :span="12">
              <el-form-item label="报告日期" label-width="100px">
                <el-date-picker v-model="formFileds.adverseDate" value-format="yyyy-MM-dd" :editable="false" :clearable="false"></el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="事件发生时间" label-width="120px">
                <el-date-picker v-model="formFileds.eventDate" value-format="yyyy-MM-dd" :editable="false" :clearable="false"></el-date-picker>
              </el-form-item>
            </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="8">
            <el-form-item label="病案号" prop="name" label-width="100px">
              <el-input v-model="formFileds.patientId"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="formFileds.patientName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="性别" prop="name">
              <el-input v-model="formFileds.sex"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row type="flex">
          <el-col :span="8">
            <el-form-item label="年龄" prop="name" label-width="100px">
              <el-input v-model="formFileds.age"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="科室" prop="name">
              <el-input v-model="formFileds.departName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="床号" prop="name">
              <el-input v-model="formFileds.bedNo"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="临床诊断" prop="address" label-width="100px">
            <el-input v-model="formFileds.clinicalDiagnosis"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="事件发生场所" prop="address" label-width="120px">
            <el-checkbox-group v-model="checkList" :max="1">
              <el-checkbox label="1">急诊</el-checkbox>
              <el-checkbox label="2">门诊</el-checkbox>
              <el-checkbox label="3">病区</el-checkbox>
              <el-checkbox label="4">医技部门</el-checkbox>
              <el-checkbox label="99">其他</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="不良事件后果" prop="address" label-width="120px">
            <el-checkbox-group v-model="checkList1" :max="1">
              <el-checkbox label="99">无</el-checkbox>
              <el-checkbox label="1">有</el-checkbox>
              <el-checkbox label="2">潜在异常事件</el-checkbox>
              <el-checkbox label="3">无伤害</el-checkbox>
              <el-checkbox label="4">轻度伤害</el-checkbox>
              <el-checkbox label="5">中度伤害</el-checkbox>
              <el-checkbox label="6">重度伤害</el-checkbox>
              <el-checkbox label="7">死亡</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-divider style="color: red;" content-position="left">事件主要表现</el-divider>
        <el-row>
          <el-form-item label="事件主要表现" prop="address" label-width="120px">
            <el-input type="textarea" v-model="formFileds.event"></el-input>
          </el-form-item>
        </el-row>
        <el-divider style="color: red;" content-position="left">不良事件类别</el-divider>
        <el-row>
          <el-form-item label="不良事件类别" prop="address" label-width="120px">
            <el-checkbox-group v-model="checkList2" :max="1">
              <el-checkbox label="1">信息传递错误事件：医师、护理、医技判定一件错误、医嘱错误（口头及书面）、其他传递方式错误</el-checkbox>
              <el-checkbox label="2">治疗错误事件：患者、部位、器材、计量等选择错误；不认真查对事件</el-checkbox>
              <el-checkbox label="3">方法（技术）错误事件：遗忘、未治疗、延期、时间或程序错误、不必要的治疗、灭菌（消毒）错误、体位错误等</el-checkbox>
              <el-checkbox label="4">药物调剂分发错误事件</el-checkbox>
              <el-checkbox label="5">输血事件</el-checkbox>
              <el-checkbox label="6">导管操作事件</el-checkbox>
              <el-checkbox label="7">医疗技术检查事件</el-checkbox>
              <el-checkbox label="8">基础护理事件</el-checkbox>
              <el-checkbox label="9">营养与饮食事件</el-checkbox>
              <el-checkbox label="10">物品运输事件</el-checkbox>
              <el-checkbox label="11">放射安全事件</el-checkbox>
              <el-checkbox label="12">诊疗记录事件</el-checkbox>
              <el-checkbox label="13">知情同意事件</el-checkbox>
              <el-checkbox label="14">非预期事件</el-checkbox>
              <el-checkbox label="15">医护安全事件</el-checkbox>
              <el-checkbox label="16">不作为事件</el-checkbox>
              <el-checkbox label="17">院内感染不良事件</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="感染例数" prop="address" label-width="150px">
            <el-input type="textarea" v-model="formFileds.col10"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="发生感染疾病名称" prop="address" label-width="150px">
            <el-input type="textarea" v-model="formFileds.col11"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="其他事件：非以上列之异常事件" prop="address" label-width="150px">
            <el-input type="textarea" v-model="formFileds.col12"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="不良事件等级" prop="address" label-width="150px">
            <el-checkbox-group v-model="checkList3" :max="1">
              <el-checkbox label="1">I级事件</el-checkbox>
              <el-checkbox label="2">II级事件</el-checkbox>
              <el-checkbox label="3">III级事件</el-checkbox>
              <el-checkbox label="4">IV级事件</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="导致事件的可能原因" prop="address" label-width="150px">
            <el-checkbox-group v-model="checkList4" :max="1">
              <el-checkbox label="1">个人原因</el-checkbox>
              <el-checkbox label="2">设备设施原因</el-checkbox>
              <el-checkbox label="3">耗材药品原因</el-checkbox>
              <el-checkbox label="4">系统流程原因</el-checkbox>
              <el-checkbox label="5">工作环境原因</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="报告人" prop="address" label-width="150px">
            <el-checkbox-group v-model="checkList5" :max="1">
              <el-checkbox label="1">医师</el-checkbox>
              <el-checkbox label="2">技师</el-checkbox>
              <el-checkbox label="3">护理人员</el-checkbox>
              <el-checkbox label="99">其他</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="当事人类型" prop="address" label-width="150px">
            <el-checkbox-group v-model="checkList6" :max="1">
              <el-checkbox label="1">本院员工</el-checkbox>
              <el-checkbox label="2">进修生</el-checkbox>
              <el-checkbox label="3">学生</el-checkbox>
              <el-checkbox label="4">不详</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item label="专业职务" prop="address" label-width="150px">
            <el-checkbox-group v-model="checkList7" :max="1">
              <el-checkbox label="1">高级</el-checkbox>
              <el-checkbox label="2">中级</el-checkbox>
              <el-checkbox label="3">初级</el-checkbox>
              <el-checkbox label="4">不详</el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="报告人签名" label-width="150px">
              <el-input v-model="formFileds.reporterId"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="科主任负责人签名" label-width="130px">
              <el-input v-model="formFileds.principal"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="联系电话" label-width="150px">
              <el-input v-model="formFileds.phone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="Email" label-width="130px">
              <el-input v-model="formFileds.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
<!--        <el-form-item>-->
<!--          <el-button type="primary" @click="handleSubmit(formFileds.id)" class="pull-right margin-l-25">确定</el-button>-->
<!--          <el-button @click="isShowEditDialog = false;" class="pull-right">取消</el-button>-->
<!--        </el-form-item>-->
      </el-form>
    </my-dialog>
  </div>
  </my-wrapper>
</template>

<script>
  import {addTreatment,treatmentQueryPage,editTreatment,deleteTreatmentEvent} from '@/api/account.js';
  export default {
    name: "Table",
    data() {
      return {
        checkList:[],
        checkList1:[],
        checkList2:[],
        checkList3:[],
        checkList4:[],
        checkList5:[],
        checkList6:[],
        checkList7:[],
        checkList8:[],
        formFileds: {
          date: '',
          name: '',
          address: '',
          id: '',
          eventId:undefined,
          adverseDate:undefined,//上报不良事件日期date
          eventDate:undefined,
          departName:'内科',//科室
          departId:'101',//科室编码
          reporterName:'主任医生',//报告人
          reporterId:'001',//报告人编码

          //患者基本情况
          patientName:'张三',//患者姓名
          birthday:undefined,//出生日期date
          ageType:undefined,//年龄类型
          age:30,//年龄
          sex:'男',//性别
          patientId:'1001',//病历号
          patientNo:'1001',//病历号
          medicalHistory:'无',//既往病史
          bedNo:102,//床号
          clinicalDiagnosis:'扁桃体发炎',//临床诊断

          place:undefined,//事件发生场所
          results:undefined,//不良事件后果
          event:undefined,//事件主要表现
          eventCategory:undefined,//不良事件类别

          eventLevel:undefined,//不良事件等级
          eventReasonType:undefined,//导致事件的可能原因
          reporterType:undefined,//报告人
          partiesType:undefined,//当事人的类别
          duties:undefined,//专业职务
          principal:undefined,//科室负责人签名
          phone:undefined,//联系电话
          email:undefined,//Email
        },
        rules: {
          // name: [
          //   {required: true, message: '姓名不能为空', trigger: 'blur, change'}
          // ],
          // address: [
          //   {required: true, message: '地址不能为空', trigger: 'blur, change'}
          // ]
        },
        tableData: [],
        isShowEditDialog: false
      }

    },
    created() {
      this.getData();
    },
    methods: {
      formatDate(now, type) {
        let date = new Date(now)
        let y = date.getFullYear() // 年份
        let m = date.getMonth() + 1 // 月份，注意：js里的月要加1
        if (m < 10) {
          m = "0" + m;
        }
        let d = date.getDate() // 日
        if (d < 10) {
          d = "0" + d;
        }
        if (type == "1") {
          // 返回值，根据自己需求调整，现在已经拿到了年月日时分秒了
          return y + '-' + m + '-' + d
        } else if (type == "2") {
          return m + '.' + d
        }
      },
      getData(){
        treatmentQueryPage({ "condition": {}, size: 10, current: 1}).then(response => {
          console.info(response)
          if(response.code===0){
            //localStorage.setItem("token",response.data.token);
            this.tableData = response.data.records;
          }
        });
      },
      handleRowClick(row, event, column) {
        // 仅选中当前行
        this.setCurRowChecked(row);
      },
      handleCheckedAllAndCheckedNone(selection) {
        // 当前选中仅一行时操作-（当前表格行高亮）
        1 != selection.length && this.$refs.list.setCurrentRow();
      },
      dialogClose() {
        // 清空编辑表单
        this.$refs.editForm.resetFields();
      },
      //清空表单信息
      resetForm(){
        this.checkList =[];
        this.checkList1 = [];
        this.checkList2 = [];
        this.checkList3 = [];
        this.checkList4 = [];
        this.checkList5 = [];
        this.checkList6 = [];
        this.checkList7 = [];
        this.formFileds={
          date: '',
          name: '',
          address: '',
          id: '',

          eventId:undefined,
          adverseDate:undefined,//上报不良事件日期date
          eventDate:undefined,
          departName:'内科',//科室
          departId:'101',//科室编码
          reporterName:'主任医生',//报告人
          reporterId:'001',//报告人编码

          //患者基本情况
          patientName:'张三',//患者姓名
          birthday:undefined,//出生日期date
          ageType:undefined,//年龄类型
          age:30,//年龄
          sex:'男',//性别
          patientId:'1001',//病历号
          patientNo:'1001',//病历号
          medicalHistory:'无',//既往病史
          bedNo:102,//床号
          clinicalDiagnosis:'扁桃体发炎',//临床诊断

          place:undefined,//事件发生场所
          results:undefined,//不良事件后果
          event:undefined,//事件主要表现
          eventCategory:undefined,//不良事件类别

          eventLevel:undefined,//不良事件等级
          eventReasonType:undefined,//导致事件的可能原因
          reporterType:undefined,//报告人
          partiesType:undefined,//当事人的类别
          duties:undefined,//专业职务
          principal:undefined,//科室负责人签名
          phone:undefined,//联系电话
          email:undefined,//Email
        }
      },
      rowNew(){
        this.resetForm();
        this.formFileds.adverseDate = this.formatDate(new Date().getTime(),"1");
        this.formFileds.eventDate = this.formFileds.adverseDate;
        this.isShowEditDialog = true;
      },
      rowEdit(index, row) {
        console.info(row)
        this.resetForm();
        if(row.place != null){
          this.checkList.push(row.place);
        }
        if(row.results != null){
          this.checkList1.push(row.results);
        }
        if(row.eventCategory != null){
          this.checkList2.push(row.eventCategory);
        }
        if(row.eventLevel != null){
          this.checkList3.push(row.eventLevel);
        }
        if(row.eventReasonType != null){
          this.checkList4.push(row.eventReasonType);
        }
        if(row.reporterType != null){
          this.checkList5.push(row.reporterType);
        }
        if(row.partiesType != null){
          this.checkList6.push(row.partiesType);
        }
        if(row.duties != null){
          this.checkList7.push(row.duties);
        }
        this.setCurRowChecked(row);
        // 给编辑弹出层赋值
        // ***这里需要注意的是：因为加了排序 所以tableData的顺序和实际显示的行顺序不一样
        for (let key in this.formFileds) {
          this.formFileds[key] = row[key];
        }
        this.isShowEditDialog = true;
      },
      handleSubmit(){
        this.formFileds.place = this.checkList[0]
        this.formFileds.results = this.checkList1[0]
        this.formFileds.eventCategory = this.checkList2[0]
        this.formFileds.eventLevel = this.checkList3[0]
        this.formFileds.eventReasonType = this.checkList4[0]
        this.formFileds.reporterType = this.checkList5[0]
        this.formFileds.partiesType = this.checkList6[0]
        this.formFileds.duties = this.checkList7[0]
        if(this.formFileds.eventId!=null&&this.formFileds.eventId!=""){
          //this.handleEdit(this.formFileds.id);
          editTreatment(this.formFileds).then(response => {
            console.info(response)
            if(response.code===0){
              this.$message.success(response.msg);
              this.getData();
              this.isShowEditDialog = false;
            }else{
              this.$message.error(response.msg);
            }
          });
        }else{
          this.formFileds.status = '1';
          addTreatment(this.formFileds).then(response => {
            console.info(response)
            if(response.code===0){
              this.$message.success(response.msg);
              this.tableData.push(this.formFileds);
              //this.resetForm();
              this.isShowEditDialog = false;
            }else{
              this.$message.error(response.msg);
            }

          });
        }
      },
      handleEdit(id) {
        let that = this;
        this.$refs.editForm.validate(isValid => {
          if (!isValid) return;
          // 保存编辑后的数据
          this.tableData.forEach(function(val,index){
            if(val.id == id){
              Object.assign(that.tableData[index], that.formFileds);
            }
          })
          this.isShowEditDialog = false;
          // 考虑到可能编辑了日期-需要重新排序
          // ***注意：手动排序传参和表格的default-sort属性格式不太一样
          this.$refs.list.sort('date', 'descending');
          this.$message.success('编辑成功');
        });
      },
      rowDel(index, row, event) {
        let that = this;
        // 让当前删除按钮失焦
        event.target.blur();
        this.$confirm('确定要审核当前行吗？', '审核', {
          comfirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(() => {
          //this.tableData.splice(row.id, 1);
          row.status = '2'
          editTreatment(row).then(response => {
            console.info(response)
            if(response.code===0){
              this.$message.success('审核成功');
              this.getData();
            }else{
              this.$message.error(response.msg);
            }
          });
          return false;
        });
      },
      rowDel1(index, row, event) {
        let that = this;
        // 让当前删除按钮失焦
        event.target.blur();
        this.$confirm('确定要审核当前行吗？', '审核不通过', {
          comfirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(() => {
          //this.tableData.splice(row.id, 1);
          row.status = '-99'
          editTreatment(row).then(response => {
            console.info(response)
            if(response.code===0){
              this.$message.success('审核成功');
              this.getData();
            }else{
              this.$message.error(response.msg);
            }
          });
          return false;
        });
      },
      rowDel12(index, row, event) {
        let that = this;
        // 让当前删除按钮失焦
        event.target.blur();
        this.$confirm('确定要删除当前行吗？', '删除', {
          comfirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(() => {
          deleteTreatmentEvent({"eventId":row.eventId}).then(response => {
            console.info(response)
            if(response.code===0){
              this.$message.success(response.msg);
              this.getData();
            }else{
              this.$message.error(response.msg);
            }
          });
          return false;
        });
      },
      // 选中当前行-当前行的复选框被勾选
      setCurRowChecked(row) {
        this.$refs.list.clearSelection();
        this.$refs.list.toggleRowSelection(row);
      }
    }
  }
</script>

<style scoped lang="scss">
.el-form {
  padding: 0 10px;
}
.el-date-editor {
  width: 100% !important;
}
::v-deep .el-table{
  font-size: 11px;
}
.el-divider{
  background-color: #40a9ff;
}

.el-divider__text{
  color: #007df8;
}
</style>
